<template>
  <el-tooltip
    placement="top-start"
    popper-class="render-tootip"
    effect="dark"
    :content="props.content"
  >
    <div class="header-icon">
      <div class="header-label">{{ props.label }}</div>
      <el-icon><QuestionFilled /></el-icon>
    </div>
  </el-tooltip>
</template>

<script setup lang="ts">
const props = defineProps({
    label: String,
    content: String
});
</script>
<style lang="scss" scoped>
.header-icon {
  .header-label {
    display: inline-block;
    vertical-align: middle;
  }
  .el-icon {
    margin-left: 2px;
    vertical-align: middle;
  }
}
</style>